<template>
	<view class="search-wrapper">
		<view class="cu-bar search bg-white">
			<view class="search-form round">
				<text class="cuIcon-search"></text>
				
				<!-- <view class="search-form round">
					<text class="cuIcon-search"></text>
					<input type="text" placeholder="请输工具名称" v-model="keyword" />
					<input type="text" placeholder="请输工具资规格" v-model="keyword2" />
				</view> -->
				
				<template v-if="type== 'BA_MATER'" >
					<input type="text" placeholder="请输名称" v-model="keyword1" />
					<input type="text" placeholder="请输规格" v-model="keyword2" />
				</template>
				
					
				<input v-else v-model="keyword" @input="inputKey" :adjust-position="false" type="text"
					placeholder="请输入2个及以上关键字查询" confirm-type="search" />
					
			</view>
			<view class="action" @click="handleSearch">
				<button class="cu-btn bg-green shadow-blur round">搜索</button>
			</view>
			
			
			
			
			
			
		</view>
		<view class="search-list font-35">
			<template v-if="type== 'EQBOM'">
				<view class="BQ-item" v-for="(item,index) in listData" :key="item.BILLNO" @click="selectData(item)">
					<view class="text-blue">{{ item.FullName || item.VNAME || item.RealName ||item.text}}</view>
					<view>生产线：{{ item.DEPTNAME }}</view>
					<view v-if="item.EQSTATION">位置：{{ item.EQSTATION }}</view>
				</view>
			</template>

			<template v-else-if="type== 'BA_MATER'">
				<view class="BQ-item" v-for="(item,index) in listData" :key="index" @click="selectData(item)">
					<view class="text-blue">{{ item.MATERIALNAME || item.VNAME }}  </view>
					<view>规格：{{ item.MATSPEC || '' }}</view>
					<view v-if="item.EQSTATION">位置：{{ item.EQSTATION }}</view>
				</view>
			</template>

			<template v-else>
				<view class="list-item flex-sb" v-for="(item,index) in listData" :key="index" @click="selectData(item)">
					<!-- 查询货位时带出仓库显示 -->
					<view class v-if="item.STORENAME && type== 'BD_RACK' ">{{ item.STORENAME || '' }}</view>

					<view class="text-blue">{{ item.FullName || item.VNAME || item.RealName ||item.text}}</view>

					<view class v-if="item.DRID">{{ item.DRID }}</view>
					<!-- 查询供应商时显示账户 -->
					<view class v-if="type== 'BD_SUPPLIER'">{{ item.BILLNO }}</view>
				</view>
			</template>

		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from "vuex";
	import api from "../../common/api.js";
	import util from "../../common/util.js";
	let _self, searchUrl, urlParams, types, queryJson = {
		keyword: ''
	};

	let page = 1,
		total = 1;
	export default {
		computed: mapState(["userInfo"]),
		data() {
			return {
				type: "",
				title: "",
				keyword: "",
				
				keyword1:'',
				keyword2:'',
				listData: [],
				i: "",
				organizeId: ""
			};
		},

		onLoad: function(params) {
			_self = this;
			let title = "查询";
			types = params.t;
			_self.type = types;
			_self.organizeId = params.organizeId || params.PK_GROUP || params.PK_ORG || _self.userInfo.ORGANIZEID;
			_self.i = params.i;
			
			page = 1;
			total = 1;
			_self.listData = [];

			try {
				queryJson = JSON.parse(params.queryjson);
			} catch (e) {
				//TODO handle the exception
			}


			// console.log(JSON.stringify(_self.userInfo));
			// console.log(params);
			switch (params.t) {
				case "GROUP":
					_self.title = "查询集团";
					break;
				case "BA_ORGANIZE":
					_self.title = "查询组织";
					break;
				case "BA_DEPARTMENT":
					_self.title = "查询部门";
					// _self.organizeId = params.PK_ORG
					break;
				case "BA_USER":
					_self.title = "查询人员";
					break;
				case "BD_SUPPLIER":
					_self.title = "查询供应商";
					break;
				case "BD_STORE":
					_self.title = "查询仓库";
					break;
				case "BD_RACK":
					_self.title = "查询货位";
					break;
				case "ORGNAME":
					_self.title = "查询移入组织";
					break;
				case "INORGNAME":
					_self.title = "查询移出组织";
					break;
				case "EQBOM":
					_self.title = "查询设备信息";
					break;
				case "BA_MATER":
					_self.title = "查询物资";
					break;	
				default:
					break;
			}
			uni.setNavigationBarTitle({
				title: _self.title
			});
			_self.requestList("", _self.i);
		},
		onShow: function() {},

		//下拉刷新
		onPullDownRefresh: function() {
			// 重置分页及数据
			page = 1;
			total = 1;
			queryJson.PK_ORG = _self.userInfo.ORGANIZEID;
			_self.listData = [];
			// queryJson = "";
			_self.requestList(_self.keyword);
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 1000);
			uni.showToast({
				title: "数据已刷新",
				icon: "none"
			});
		},
		// 加载更多
		onReachBottom: function() {
			_self.requestList(_self.keyword);
		},

		methods: {
			// ...mapMutations(['selectReduce']), // 引入 store 中的reduce方法
			inputKey: function(e) {
				page = 1;
				total = 1;
				_self.listData = [];
				
				let val = e.detail.value;
				if (val.length > 1) {
					this.requestList(val);
				}
			},
			handleSearch() {
				page = 1;
				total = 1;
				_self.listData = [];
				_self.requestList(_self.keyword);
			},
			selectData(e) {
				uni.navigateBack({});
				setTimeout(() => {
					uni.$emit("getSelectItem", {
						...e
					});
				}, 500)
			},
			requestList: function(e, i) {
				// console.log(page , total);
				if (page > total) {
					return this.$utils.tips("没有数据了");
				}

				queryJson.VNAME = _self.keyword
				queryJson.keyword = _self.keyword
				if (i != 11) {
					let requestData = {
						category: types,
						keyword: _self.keyword,
						VNAME: _self.keyword,
						comboboxId: "",
						queryJson: queryJson,
						PK_ORG: _self.organizeId,
						organizeId: _self.organizeId,
						QueryType: 0,
						userId: _self.userInfo.UserId,
						account: _self.userInfo.Account
					};
					let URL = _self.type == 'EQBOM' ? '/API/APPCommon/GetEquipmentData' : api.apiPublic.searchUrl;

					if (_self.type == 'BA_MATER') {
						requestData.category = 'ST_STOCKINFO'
						requestData.page =  page
						requestData.rows =  50
						requestData.queryJson.MATERIALNAME = this.keyword1
						requestData.queryJson.MATSPEC = this.keyword2
						URL = api.apiPublic.getMaterList
					}

					if (_self.type == 'EQBOM') {
						requestData = {
							"page": page ,
							"rows": 10 ,
							"userId": _self.userInfo.UserId,
							"account": _self.userInfo.Account,
							"PK_MATERIAL": queryJson.PK_MATERIAL,
							"IsPage": "true",
							"queryJson": {
								"PK_ORG": _self.organizeId,
								"VNAME": e,
								"keyword": e,
							}
						}
					}
					console.log(URL,_self.type , requestData);
					this.axios({
							url: URL,
							data: requestData,
							isLoading: 1
						})
						.then((res) => {
							// console.log(777 , res );
							let { Result } = res 
							if (_self.type == 'EQBOM' || _self.type == 'BA_MATER') {
								_self.listData = [ ..._self.listData , ...res.Result.rows ]  
								total = Result.total;
								page++;
							}else{
								_self.listData = Result;
							}
						}).catch(err => {
							console.log(err);
						})
				} else if (i == 11) {
					let url =
						"/api/WMSCommonDataList/GetStockOrgTreeList?category=" +
						types +
						"&keyword=" +
						e +
						"&comboboxId=" +
						"&organizeId=" +
						_self.organizeId +
						"&QueryType=0&account=" +
						_self.userInfo.Account;
					// console.log(url);
					this.axios({
							url: url,
							method: "GET",
							isLoading: 1
						})
						.then((res) => {
							console.log(123, res);
							_self.listData = res.data[0].ChildNodes;

							
						})
				}
			} // requestList end
		}
	};
</script>

<style scoped>
	.search-wrapper {}

	.search-list {
		background-color: #ffffff;
		margin-top: 20upx;
	}

	.BQ-item {
		padding: 20upx;
		border-bottom: 1px solid #dbdbdb;
	}

	.list-item {
		padding: 20upx;
		border-bottom: 1px solid #dbdbdb;
		display: flex;
		justify-content: space-between;
	}

	.list-item:active {
		background-color: #ededed;
	}
</style>